 <template>
  <div>
    <div class="big">
      <dl v-for="(item, index) in arr" :key="item">
        <router-link :to="{ path: '/Bm', query: { detail_id: index } }">
          <img :src="item.icon" alt="" />
          <p class="p1">{{ item.name }}</p>
          <p class="p2">
            原价:<del>￥{{ item.yj }}元</del
            ><span>促销价:￥{{ item.pice }}</span>
          </p>
        </router-link>
      </dl>
    </div>
  </div>
</template>
 <script>

export default {
  data() {
    return {
      arr: [
        {
          icon: "https://img.alicdn.com/bao/uploaded/i1/1809143586/O1CN01hXQWxc1cMQwyhno1P_!!0-item_pic.jpg_200x200q90.jpg_.webp",
          pice: 9.9,
          name: "鞋架子简易门口宿舍家用室内好看收纳神器防尘鞋柜经济型卧室小型",
          yj: 5,
        },
        {
          icon: "https://img.alicdn.com/bao/uploaded/i2/3135717464/O1CN01AQxKVT250YsG9WtPF_!!0-item_pic.jpg_200x200q90.jpg_.webp",
          pice: 9.9,
          name: "鸭脖子零食大礼包网红小吃女生一箱充饥夜宵整箱散装休闲食品组合",
          yj: 5,
        },
        {
          icon: "https://img.alicdn.com/bao/uploaded///asearch.alicdn.com/bao/uploaded//i1/2972316483/O1CN012NCjIw1xlGOIxyqIV_!!0-item_pic.jpg_200x200q90.jpg_.webp",
          pice: 298,
          name: "欧洲站潮牌青少年外套男潮流百搭男装21年秋季新款夹克棒球服男潮",
          yj: 398,
        },
        {
          icon: "https://img.alicdn.com/bao/uploaded///asearch.alicdn.com/bao/uploaded//i1/1662994353/O1CN01BEL0lQ1i1ihAMqLqP_!!1662994353.jpg_200x200q90.jpg_.webp",
          pice: 167,
          name: "全纯净素食淯苗植物燕麦奶台湾麦片豆奶粉早餐即食冲饮谷物代餐粉",
          yj: 250,
        },
      ],
    };
  },
  methods: {},
  computed: {},
};
</script>
 <style lang='css'>
* {
  margin: 0;
  padding: 0;
}
a {
  text-decoration: none;
}
.big {
  width: 1200px;
  height: 200px;
  background: #fff;
  margin: 0 auto;
}
.big dl {
  text-align: center;
  width: 20%;
  height: 250px;
  float: left;
}
.big dl img {
  width: 100%;
  height: 200px;
}

.p1 {
  font-size: 14px;
  color: #000;
}

.p2 {
  font-size: 14px;
  color: #323639;
  text-decoration: none;
}
.p2 span {
  color: red !important;
}
</style>